<template>
    <div>
        <el-input v-model="input" size="mini">
          <template slot="append">
              <el-upload
                  accept=".jpg,.png"
                  :limit='1'
                  :show-file-list='false'
                  :before-upload="beforeImg"
                  :on-error="fileError"
                  :on-success="fileSuccess"
                  :on-exceed="log"
                  :action="uploadUrl"
                  :file-list="fileList">
                  <el-button size="small">图片上传</el-button>
              </el-upload>
          </template>
      </el-input>
    </div>
</template>

<script>
  export default {
    data() {
      return {
        uploadUrl:'http://10.21.237.42:9001/appcloud-file/appcloudfile/uploadSmallFile',  // http://10.21.237.42:9001   // http://175.6.40.19:9001
        fileList: [],
        filetext:'',
        input:'',
      }
    },
    methods: {
      fileSuccess(response, file) {
      if (response.code === 0) {
        this.$message("图片上传" + response.message);
        this.input = file.name
        file.url = response.data
        this.$emit('childUrl', response.data)
      }
    },
    // 文件上传失败方法
    fileError(err) {
      console.log(err);
    },
    log() {
       this.$message('最多只能上传一张图片')
    },
    beforeImg(file) {
        let upFileName = file.name;
        let index1 = upFileName.lastIndexOf(".");
        let index2 = upFileName.length;
        let suffix = upFileName.substring(index1 + 1, index2);
        if (suffix === "png" || suffix === "jpg") {
            console.log(suffix)
        }else {
            this.$message('请上传jpg或png图片，且只能上传一张。');
            return false
        }
        
    }
  }
  }
</script>

